﻿@model TestCAI.Models.CaiViewModel

@{
    ViewBag.Title = "New CAI - Mobile";
}

<head>
    @Styles.Render("~/Content/mobiscrollcss")
</head>


@*<h2>New CAI</h2>*@



@using (Html.BeginForm())
{
        <fieldset>
 <div data-role="collapsible-set">
     <div data-role="collapsible" data-collapsed="true">
                <h3>CAI Details</h3>
                <strong> Shopping Center: </strong>
                 @Html.DropDownListFor(model => model.cai.StoreNumber, Model.lstShoppingCenters) 

 <br />
        <strong> Inspected By : </strong>
       @Html.TextBoxFor(model => model.cai.User, new { maxlength = 50, size = 55 })
       <br/>
    <strong>Inspection Date:</strong>
    @Html.TextBoxFor(model =>model.cai.InspectionDate, new { name = "inspectionDate", id = "inspectionDate", @Value = ""})

    </div>
    <div data-role="collapsible" data-collapsed="true">
                <h3>Roof</h3>
       <strong>Gutter/Downspouts: </strong> 
 @Html.DropDownListFor(model => model.cai.GutterDownSpout, Model.DropDownItems) 

<br />
<strong>Comments</strong>
@Html.TextAreaFor(model => model.cai.GutterDownSpoutComm, new { maxlength = 700, size = 100 })
<br />
       <strong>Leaks: </strong> 
 @Html.DropDownListFor(model => model.cai.Leaks, Model.DropDownItems) 

<br />
<strong>Comments</strong>
@Html.TextAreaFor(model => model.cai.LeaksComm, new { maxlength = 700, size = 100 })





    </div>

     <div data-role="collapsible" data-collapsed="true">
                <h3>Lighting</h3>
                    <strong>PL Lights/Poles: </strong> 
 @Html.DropDownListFor(model => model.cai.PlLightPoles, Model.DropDownItems) 

<br />
<strong>Comments</strong>
@Html.TextAreaFor(model => model.cai.PlLightPolesComm, new { maxlength = 700, size = 100 })
<br />
                    <strong>Ext Bldg Lighting: </strong> 
 @Html.DropDownListFor(model => model.cai.ExtBldLighting, Model.DropDownItems)
<br />
<strong>Comments</strong>
@Html.TextAreaFor(model => model.cai.ExtBldLightingComm, new { maxlength = 700, size = 100 })
       
    </div>

 </div>

@*<fieldset>

        <h2>Vehicle:</h2>

        <strong> Fuel Entry Date : </strong>
    
        <br />

        <strong> Fueling Description / Comments : </strong>
      
        <br />
        <div class="ui-grid-a">
            <div class="ui-block-a">
                <strong> Odometer : </strong>
            </div>
            <div class="ui-block-b">
                <strong> Gallons : </strong>
            </div>
        </div>
        <div class="ui-grid-a">
            <div class="ui-block-a">
              
            </div>
            <div class="ui-block-b">
               
            </div>
        </div>
        <br />

        
        </fieldset>*@
        <p>
            <input type="submit" value="Save New CAI" />
        </p>
</fieldset>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/mobiscroll")

<script type="text/javascript">
    
    $(function () {
        $('#inspectionDate').mobiscroll().date({
            theme: 'default',
            accent: 'none',
            lang: 'en',
            display: 'bubble',
            mode: 'scroller',
            animate: ''
        });
        $('#show').click(function () {
            $('#inspectionDate').mobiscroll('show');
            return false;
        });
        $('#clear').click(function () {
            $('#inspectionDate').val('');
            return false;
        });
    });
</script>
}